<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="style/semantic.min.css">
    <link rel="stylesheet" type="text/css" href="style/swiper.min.css">
    <link rel="stylesheet" type="text/css" href="style/base.css">
</head>
<body>
<!--导航 start-->
<div class="ui inverted menu">
    <div class="ui container">
        <a class="item">
            <img src="images/logo.png" style="width: 173px;height: 54px;">
        </a>
        <a class="item">
            首页
        </a>
        <a class="item">
            新闻中心
        </a>
        <a class="item">
            方案中心
        </a>
        <div class="item">
            应用案例
        </div>
        <a class="item">
            下载中心
        </a>
        <a class="item">
            联系我们
        </a>
        <div class="right menu">
            <a href="" class="item"><span class="ui inverted button">好客云注册</span></a>
            <a href="" class="item">登录</a>
        </div>

    </div>
</div>
<!--导航 end-->
<!--banner start-->
<div class="ui fluid container">
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="images/banner01.jpg" alt=""></div>
            <div class="swiper-slide"><img src="images/banner01.jpg" alt=""></div>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
        <!-- Add Arrows -->
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
    </div>


</div>
<!--banner end-->

<!--软件方案 start-->
<div class="ui fluid container padtb">
    <div class="ui horizontal divider title">
        软件解决方案
        <div class="label">SOFTWARE SOLUTIONS</div>
    </div>
    <div class="ui four column grid container" style="padding:5rem 0;">
        <div class="column">
            <a href="#" class="soft">
                <img src="images/web_03.jpg" alt="">
                 <p>快餐连锁ERP+</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="soft">
                <img src="images/web_05.jpg" alt="">
                <p>中餐连锁ERP+</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="soft">
                <img src="images/web_07.jpg" alt="">
                <p>客房连锁ERP+</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="soft">
                <img src="images/web_09.jpg" alt="">
                <p>综合类酒店</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="soft">
                <img src="images/web_15.jpg" alt="">
                <p>移动收银台</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="soft">
                <img src="images/web_16.jpg" alt="">
                <p>高效扫码点餐</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="soft">
                <img src="images/web_17.jpg" alt="">
                <p>会员营销方案</p>
            </a>
        </div>
    </div>
</div>
<!--软件方案 end-->

<!--硬件方案 start-->
<div class="ui fluid container padtb hard-solutions">
    <div class="ui horizontal divider title white">
        硬件解决方案
        <div class="label">HARDWARE SOLUTIONS</div>
    </div>
    <div class="ui four column grid container" style="padding:10rem 0 19rem;">
        <div class="column">
            <a href="#" class="hard">
                <img src="images/web_22.jpg" alt="">
                <p>点菜机</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="hard">
                <img src="images/web_24.jpg" alt="">
                <p>触摸屏</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="hard">
                <img src="images/web_26.jpg" alt="">
                <p>无纸化智能厨房</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="hard">
                <img src="images/web_28.jpg" alt="">
                <p>打印机</p>
            </a>
        </div>
    </div>
</div>
<!--硬件方案 end-->

<!--经典客户案例 start-->
<div class="ui fluid container padtb">
    <div class="ui horizontal divider title">
        经典客户案例
        <div class="label">CLASSIC CUSTOMER CASE</div>
    </div>
    <div class="ui four column grid container" style="padding: 5rem 0;">
        <div class="column">
            <a href="#" class="case">
                <img src="images/web_35.jpg" alt="">
                <p>快餐连锁ERP+</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="case">
                <img src="images/web_37.jpg" alt="">
                <p>中餐连锁ERP+</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="case">
                <img src="images/web_39.jpg" alt="">
                <p>客房连锁ERP+</p>
            </a>
        </div>
        <div class="column">
            <a href="#" class="case">
                <img src="images/web_41.jpg" alt="">
                <p>综合类酒店</p>
            </a>
        </div>
    </div>
</div>
<!--经典客户案例 end-->

<!--新闻中心 start-->
<div class="ui fluid container padtb news-center" style="height:900px;">
    <div class="ui horizontal divider title white">
        新闻中心
        <div class="label">NEWS CENTER</div>
    </div>
    <div class="ui grid container" style="padding: 5rem 0;">
        <!--新闻动态 start-->
        <div class="seven wide column">
            <div class="h-title">新闻动态</div>
            <div class="times">
                <ul>
                    <li>
                        <div class="outer"><div class="inner"></div></div>
                        <a>这里是2012年哟</a>
                        <span>2012-01-01</span>
                    </li>
                    <li>
                        <div class="outer"><div class="inner"></div></div>
                        <a>这里是2012年哟</a>
                        <span>2012-01-01</span>
                    </li>
                    <li>
                        <div class="outer"><div class="inner"></div></div>
                        <a>这里是2012年哟</a>
                        <span>2012-01-01</span>
                    </li>
                    <li>
                        <div class="outer"><div class="inner"></div></div>
                        <a>这里是2012年哟</a>
                        <span>2012-01-01</span>
                    </li>
                    <li>
                        <div class="outer"><div class="inner"></div></div>
                        <a>这里是2012年哟</a>
                        <span>2012-01-01</span>
                    </li>
                    <li>
                        <div class="outer"><div class="inner"></div></div>
                        <a>这里是2012年哟</a>
                        <span>2012-01-01</span>
                    </li>
                </ul>
            </div>
            <a href="#" style="color: #FFF;margin-left:60%;">更多新闻</a>
        </div>
        <!--新闻动态 end-->
        <!--团队展示 start-->
        <div class="nine wide column">
            <div class="h-title">团队展示</div>
            <div class="ui two column grid container" style="padding: 5rem 0;">
                <div class="column">
                    <a href="#" class="team-show">
                        <img src="images/web_48.jpg" alt="">
                        <p>快餐连锁ERP+</p>
                    </a>
                </div>
                <div class="column">
                    <a href="#" class="team-show">
                        <img src="images/web_48.jpg" alt="">
                        <p>快餐连锁ERP+</p>
                    </a>
                </div>
                <div class="column">
                    <a href="#" class="team-show">
                        <img src="images/web_48.jpg" alt="">
                        <p>快餐连锁ERP+</p>
                    </a>
                </div>
                <div class="column">
                    <a href="#" class="team-show">
                        <img src="images/web_48.jpg" alt="">
                        <p>快餐连锁ERP+</p>
                    </a>
                </div>
            </div>
        </div>
        <!--团队展示 end-->
    </div>
</div>
<!--新闻中心 end-->

<!--关于我们 start-->
<div class="ui fluid container padtb about-us" style="height: 819px">
    <div class="ui horizontal divider title">
        关于我们
        <div class="label">ABOUT US</div>
    </div>
    <div class="ui container">
        <p style="font-size: 1.2rem;margin:5rem auto;color:#666;">
        山东好食好客信息科技股份有限公司是一家专业为餐饮行业提供信息化和管理咨询服务的高新技术企业。好食好客产品自1999年面世以来，服务了全国3万多家餐饮、商户，舍友四川办事处、贵州办事处、黑龙江办事处、西安办事处、河北办事处，以及代理商200多家，形成覆盖全国完善的销售、咨询、售后、运营等服务体系。
        </p>
    </div>
</div>
<!--关于我们 end-->

<!--联系我们 start-->
<div class="ui fluid container padtb contact-us" style="height:820px;">
    <div class="ui horizontal divider title white">
        联系我们
        <div class="label">CONTACT US</div>
    </div>
    <div class="ui grid container" style="padding: 5rem 0;">
        <!--联系方式 start-->
        <div class="six wide column">
            <div class="h-title">山东好食好客信息科技股份有限公司</div>
            <div class="contact">
                销售专线：0531-55567777、55567878<br>
                QQ：613667577<br>
                售后客服专线：0531-55567707<br>
                QQ：613667529<br>
                QQ：293411775<br>
                门锁调试客服QQ：613667525<br>
                餐饮连锁客服：0531-55567707<br>
                快餐连锁客服：0531-55568855<br>
                QQ：613667537<br>
                注册码客服： 0531-82373624<br>
                公司地址：山东省济南市高新区颖秀路鑫盛大厦2号楼10层<br>
            </div>
        </div>
        <!--联系方式 end-->
        <!--二维码 start-->
        <div class="four wide column">
            <img src="images/erweima.png" alt="">
        </div>
        <!--二维码 end-->
        <!--留言 start-->
        <div class="six wide column">
            <form action="" class="contact-form">
                <input type="text" placeholder="姓名">
                <input type="text" placeholder="电话">
                <input type="text" placeholder="邮箱">
                <input type="text" placeholder="内容">
                <buttun class="ui orange button fluid" style="margin-top:2.5rem;">提交</buttun>
            </form>
        </div>
        <!--留言 end-->
    </div>
</div>
<!--联系我们 end-->

<!--footer start-->
<div class="ui fluid container black">
    <div class="ui container">
        Copyright 2015. All Right Reserved. 山东好是好可信息科技股份有限公司版权所有 鲁ICP备11001641号-3
    </div>
</div>
<!--footer end-->

<script  src="js/jquery-3.2.1.min.js"></script>
<script src="js/semantic.min.js"></script>
<script src="js/swiper.min.js"></script>
<script src="https://unpkg.com/scrollreveal/dist/scrollreveal.min.js"></script>
<script>
    //页面动画
  window.sr = ScrollReveal({ reset: true });
  sr.reveal('.soft',{rotate: {y: 65} });
  sr.reveal('.hard',{rotate: {x: 65} });
  sr.reveal('.case',{rotate: {y: 65} });
  sr.reveal('.team-show',{rotate: {x: 65} });
  // banner动画
    var swiper = new Swiper('.swiper-container', {
      pagination: '.swiper-pagination',
      nextButton: '.swiper-button-next',
      prevButton: '.swiper-button-prev',
      slidesPerView: 1,
      paginationClickable: true,
      spaceBetween: 30,
      loop: true
    });
</script>
</body>
</html>